<jsp:include page="header.jsp"/>
<body>
    <jsp:include page="menutop.jsp"/>

    <div class="container-fluid">
        <div class="row-fluid">

            <!-- left menu starts -->
            <jsp:include page="leftmenu.jsp"/>
            <!-- left menu ends -->

            <div id="content" class="span10">
                <!-- content starts -->
                <div class="row-fluid sortable">
                    <div class="box span12">
                        <div class="box-header well" data-original-title>
                            <h2><i class="icon-edit"></i> Form Elements</h2>
                            <div class="box-icon">
                                <a href="#" class="btn btn-setting btn-round"><i class="icon-cog"></i></a>
                                <a href="#" class="btn btn-minimize btn-round"><i class="icon-chevron-up"></i></a>
                                <a href="#" class="btn btn-close btn-round"><i class="icon-remove"></i></a>
                            </div>
                        </div>
                        <div class="box-content">
                            <form class="form-horizontal">
                                <fieldset>
                                    <div class="control-group">
                                        <label class="control-label" for="name">User name</label>
                                        <div class="controls">
                                            <input class="input-xlarge focused" id="user_name" type="text" value="">
                                        </div>
                                    </div>
                                    <div class="control-group">
                                        <label class="control-label" for="name">Password</label>
                                        <div class="controls">
                                            <input class="input-xlarge focused" id="password" type="text" value="">
                                        </div>
                                    </div>
                                    <div class="control-group">
                                        <label class="control-label" for="name">Email</label>
                                        <div class="controls">
                                            <input class="input-xlarge focused" id="email" type="text" value="">
                                        </div>
                                    </div>
                                    <div class="control-group">
                                        <label class="control-label" for="name">Phone</label>
                                        <div class="controls">
                                            <input class="input-xlarge focused" id="phone" type="text" value="">
                                        </div>
                                    </div>
                                    

                                    <div class="control-group">
                                        <label class="control-label" for="selectError">Type ID</label>
                                        <div class="controls">
                                            <select id="type_id">
                                                <option>Option 1</option>
                                                <option>Option 2</option>
                                                <option>Option 3</option>
                                                <option>Option 4</option>
                                                <option>Option 5</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="control-group">
                                        <label class="control-label" for="name">Date created</label>
                                        <div class="controls">
                                            <input class="input-xlarge focused" id="create_date" type="text" value="">
                                        </div>
                                    </div>
                                    <div class="control-group">
                                        <label class="control-label" for="name">ID</label>
                                        <div class="controls">
                                            <input class="input-xlarge focused" id="id" type="text" value="">
                                        </div>
                                    </div>
                                    <div class="control-group">
                                        <label class="control-label" for="name">Is deleted</label>
                                        <div class="controls">
                                            <input class="input-xlarge focused" id="isdelete" type="text" value="">
                                        </div>
                                    </div>

                                    <div class="form-actions">
                                        <!--
                                        <button type="submit" class="btn btn-primary" id="save"  ></button> -->
                                        <a  class="btn btn-primary" onclick="User.Insert();"><i class="icon-remove"></i>Save changes</a>
                                        <button class="btn">Cancel</button>
                                    </div>
                                </fieldset>
                            </form>

                        </div>
                    </div><!--/span-->

                </div><!--/row-->
                <!-- content ends -->
            </div><!--/#content.span10-->
        </div><!--/fluid-row-->
    </div>                        
    <jsp:include page="footer.jsp"/>
    <script src="lib/menu.js" type="text/javascript"></script>
    <script src="lib/Contants.js" type="text/javascript"></script>
    <script src="lib/user.js" type="text/javascript"></script>
    <script>
        $(document).ready(function () 
        {       
            User.getAllType();
        });
</script>
</body>
